<!--
 * @Author: Aaron
 * @Date: 2022-01-10 11:18:04
 * @LastEditors: Aaron
 * @LastEditTime: 2022-03-14 16:06:14
 * @Description: file content
 * @FilePath: \ias_ui\src\views\coi\spuManagement\components\addSpuSearchHead.vue
 * @Company: 沃尔玛
-->
<template>
  <el-form class="add-spu-head" :inline="true" size="mini" label-width="auto">
    <el-form-item label="UPC(不含检验码)">
      <el-input v-model="searchData.upcWoCdList" placeholder="请输入UPC(不含检验码)，多个回车换行隔开" type="textarea" clearable style="width: 350px;" />
    </el-form-item>
    <el-form-item label="UPC">
      <el-input v-model="searchData.upcNbrList" placeholder="请输入UPC，多个回车换行隔开" type="textarea" clearable style="width: 350px;" />
    </el-form-item>
    <el-form-item label="商品名称">
      <el-input v-model.trim="searchData.upcName" placeholder="请输入商品名称" clearable style="width: 350px;" />
    </el-form-item>
    <el-form-item label="VSK">
      <el-input v-model.trim="searchData.vsk" placeholder="请输入VSK" clearable style="width: 350px;" />
    </el-form-item>
    <div class="search-btn">
      <el-button id="searchBtn" size="mini" type="primary" icon="el-icon-search" :loading="searchLoading" round @click="$emit('search')">查询</el-button>
      <el-button id="resetBtn" size="mini" type="primary" icon="el-icon-refresh" :loading="resetLoading" round @click="$emit('reset')">重置</el-button>
    </div>
  </el-form>
</template>

<script>
export default {
  name: 'AddSpuSearchHead',
  props: {
    searchData: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      searchLoading: false,
      resetLoading: false
    }
  }
}
</script>

<style lang="scss" scoped>
.search-btn {
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
